<!DOCTYPE html>
<html lang="en">
<head>
	<title>{{ site.tagline }} / {{ page.project.title }}</title>
	<meta name="author" content="{{ site.author }}">
	<meta name="description" content="{{ page.content | strip_html | strip_newlines }}">
	<meta name="keywords" content="{{ page.meta.keywords }}">
	{% include head.html %}
</head>
<body>
	{% include menu.html %}
	<main class="content">
		<section class="project">
			<div class="container">
				<article>
					<div class="project_section">OVERVIEW</div>
					<h1>
						<a href="{{ page.project.project_official_url }}" target="_blank" title="{{ page.project.title }}" rel="nofollow">{{ page.project.title }}</a>
					</h1>
					<div class="overview_container_out">
						<div class="overview_container_in">
							<p style="font-size: 1.5rem;font-weight: 600;">{{ page.project.overview }}</p>
						</div>
						<div class="overview_img">
							<img src="{{ page.project.logo | prepend: site.baseurl }}" alt="{{ item.project.title }}" />
						</div>
					</div>
					<div style="display: flex; flex-direction: row; align-items: center;">
						<div>
							<p style="margin-left: 4rem; font-size: 16px; font-weight: 400;"> {{ page.project.title }} offcial site: </p>
						</div>
						<h7>
							<a href="{{ page.project.project_official_url }}" target="_blank" title="{{ page.project.title }}" rel="nofollow">{{ page.project.project_official_url }}</a>
						</h7>
					</div>
					<hr class="project_section_line">
					<div class="project_section">DETAILS</div>
					{% if page.supported_releases %}
					<div class="project_detail_title">
						<h5>AArch64 Supported Releases</h5>
					</div>
					<div style="padding-left: 2rem; background: #d6d6d650; margin-left: 2rem; margin-right: 2rem;">
						<ul class="release_list">
							{% for release in page.supported_releases %}
							<li class="version_list">
								<a title="{{ release.version }}" href="{{ release.url }}" target="_blank" rel="nofollow">{{ release.version }}</a>
							</li>
							{% endfor %}
						</ul>
					</div>
					{% endif %}
					<div class="project_detail_title">
					    <h5>Project AArch64 CI Status</h5>
				    </div>
					<div style="padding-top: 0.5rem; padding-bottom: 0.5rem; padding-left: 2rem; background: #d6d6d650; margin-left: 2rem; margin-right: 2rem; font-size: 15px;
					font-weight: 400;">
					<ul class="ci_list">
						{% for CI in page.project_ci %}
							<li class="ci_items" style="text-decoration: none;">
								<div style="white-space: nowrap;">
									<a title="{{ CI.title }}" href="{{ CI.url }}" target="_blank" rel="nofollow" style="font-size: 1.5rem;">{{ CI.title }}</a>
								</div>
								<div class="ci_status_img">
									<img src="{{ CI.status | prepend: site.baseurl }}" alt="{{ CI.title }}" style="display: inline;"/>
								</div>
							</li>
							{% endfor %}
						</ul>
					</div>
					{% if page.user_stories %}
					<div class="project_detail_title">
					    <h5>User Stories</h5>
					</div>
						<div style="padding-top: 0.5rem; padding-bottom: 0.5rem; padding-left: 2rem; background: #f2f2f2; margin-left: 2rem; margin-right: 2rem; font-size: 15px;
					font-weight: 400; ">
					<ul class="story_list">
						{% for story in page.user_stories %}
							<li class="story_items" style="text-decoration: none;">
								<div>
									<h6>{{ story.title }}</h6>
								</div>
								<div>
									<p style="color: black; margin-top: 10px;">{{ story.discription }}</p>
									{% if story.language %}
									    <a title="{{ story.title }}" href="{{ story.url }}" target="_blank" rel="nofollow" style="font-size: 1.5rem; margin-top: 3px; margin-left: 900px; color: darkblue;">Read More({{story.language}}) ...</a>
								    {% else %}
									    <a title="{{ story.title }}" href="{{ story.url }}" target="_blank" rel="nofollow" style="font-size: 1.5rem; margin-top: 3px; margin-left: 930px; color: darkblue;">Read More ...</a>
									{% endif %}
									</div>
							</li>
							{% endfor %}
						</ul>
					</div>
					{% endif %}
					{% if page.work_items %}
					<div class="project_detail_title">
					    <h5>Work Items</h5>
					</div>
					<div style="padding-left: 2rem; background: #d6d6d650; margin-left: 2rem; margin-right: 2rem;"">
						<ul class="work_list">
						{% for work in page.work_items %}
							<li class="version_list" style="text-decoration: none;">
								<a title="{{ work.title }}" href="{{ work.url }}" target="_blank" rel="nofollow" style="font-size: 1.5rem;">[{{work.status}}] {{ work.title }}</a>
							</li>
							{% endfor %}
						</ul>
					</div>
					{% endif %}
					{% if page.events %}
					<div class="project_detail_title">
						<h5>News and Events</h5>
					</div>
					<div style="padding-left: 2rem; background: #d6d6d650; margin-left: 2rem; margin-right: 2rem;"">
						<ul class="event_list">
							{% for event in page.events %}
							<li class="event_item_list">
								<a title="{{ event.title }}" href="{{ event.url }}" target="_blank" rel="nofollow">[{{event.type}}] {{ event.title }} ({{event.language}})</a>
							</li>
							{% endfor %}
						</ul>
					</div>
					{% endif %}
				</article>
			</div>
		</section>
	</main>
	{% include footer.html %}
	<script src="{{ "/assets/scripts/vendor/jquery-1.12.4.min.js" | prepend: site.baseurl }}"></script>
	<script src="{{ "/assets/scripts/vendor/scrollreveal.min.js" | prepend: site.baseurl }}"></script>
	<script src="{{ "/assets/scripts/vendor/sticky-kit.min.js" | prepend: site.baseurl }}"></script>
	<script src="{{ "/assets/scripts/project.js" | prepend: site.baseurl }}"></script>
</body>
</html>